 
/*---------左侧列表------------*/
@import url(https://fonts.googleapis.com/css?family=Montserrat:500);

* {
	box-sizing: border-box;
}
.slidebody p{
	letter-spacing:3px;
}
.zhuti{
float:left;
width:100%;
}

@media screen and (min-width:768px){
.outer{ 
width:15%;
    float:left;	
	 margin-left:3%;
	 margin-top:30px;
	  box-shadow:10px 2px   15px  #686262;
	 
}
.navs1{
 width:100%;
 height:50px;
 line-height:50px;
 border-bottom:1px solid black;
 background-color:rgb(60,60,60);
 }
 .navs1:hover{
  opacity:0.5;
  }
 .quan{
 display:inline-block;
 width:17px;
 height:17px;
 border-radius:20px;
 line-height:20px;
 margin-left: 8.5px;
 }
 .quan1{
	border:1.5px solid rgb(245,171,40);
 }
.quan2{
    border:1.5px solid rgb(28,162,193);
}	
 .words{
 display:inline-block;
 color:lightgray;
 margin-left:50px;
 }

.btna{
      margin:auto;
      display:block;
      }
}
@media screen and (max-width:768px){
.outer{
   display:none;
}
}

.image-buttons input {
	border: 0.2rem solid #fafafa;	
	height:30px;
	color:black;
}
.image-buttons a{
	display:block;
}
.image-buttons a:hover{
	background-color:#a94442;
}
@media screen and (min-width:992px){
	.image-buttons input{
			width:100px;
	}
}
@media screen and (max-width:992px) and (min-width:768px){
	.image-buttons input{
		width:80%;
	}
}
@media screen and (max-width:768px){
	.image-buttons input{
		width:98%;
	}
}
.image-buttons input:focus {
	outline: none;
	border: 0.2rem solid var(--border-color);
}


/*主体部分  */

 .slidebody{
	 float:right; 
	 font-size:14px; 
	 color:rgba(102, 102, 102, 1);
 }
 
@media screen and (min-width:768px){
 .slidebody{
 	width:77%;
 	padding:30px 40px 20px 30px;
 	 }
 }
 @media screen and (max-width:768px){
 .slidebody{
 	width:100%;
 	margin-top:20px;
 	padding:20px;
 	}
 }
.whatservice{
float:left;
}
@media screen and (min-width:768px){
.whatservice{
       width:350px;
       height:250px;
       margin:0 10px 10px 0;
       }
.introduce{
       margin-top:60px;
       display:inline-block;
       }
 }
@media screen and (max-width:768px){
.whatservice{
       width:100%;
       height:200px;
       }
       }

.project{
       display:none;
      
       }
@media screen and (min-width:768px){
#project>div{
padding-bottom:20px;
}
.boxlr{
text-align:center;
margin-bottom:5px;
background-color:white;
padding:2px;
border:1px solid lightgray
}
.boxlr img{
width:300px;
height:200px;
}
.boxleft{
float:left;
margin-right:20px;
;
 
}
.boxright{
float:right;
margin-left:20px;
}
}
@media screen and (max-width:768px){
.boxlr{
text-align:center;
}
.boxlr img{
width:100%;
height:200px;
}
}
.contact{
text-align:center;
display:none;
}
.welcomimg{
margin:auto;
}
@media screen and (min-width:768px){
.contact{
       width:30%;
       margin:auto;
       }
.welcomimg{
 width:300px;
 height:300px;
 }
}
@media screen and (max-width:768px){
.contact{
       width:100%;
       }
 .welcomimg{
 width:200px;
 height:200px;
 }
       }
/*  页脚   */
 

@media screen and (max-width:768px){
	.find{
		position:fixed;
		bottom:20px;
		right:5px;
		width:70px;
		height:200px;
	}
	.find div{
		width:100%;
		height:30px;
		background-color:black;
		opacity:0.5;
		margin:2px;
	}
	.find div a{
		display:inline-block;
		width:100%;
		height:100%;
		color:white;
		opacity:1;
		margin-left:5px;
		margin-top:5px;
		
	}
}
@media screen and (min-width:768px){
	.find{
		display:none;
	}
}

